<template>
  <div class="enter-box">
    <Steps :step="step" />
    <Step1 v-if="step === 1" :id="id" ref="step1" :site-ids="siteIds" :industry-code="industryCode" @next="nextHandle(4)" />
    <!--    <Step2 v-if="step === 2" ref="step2" />-->
    <Step3 v-if="step >=3" ref="step3" />

  </div>
</template>

<script>
import Steps from './Steps.vue'
import Step1 from './Step1.vue'
// import Step2 from './Step2.vue'
import Step3 from './Step3.vue'

export default {
  name: 'Sign',
  components: {
    Steps,
    Step1,
    // Step2,
    Step3
  },
  data() {
    return {
      step: 1,
      id: '',
      industryCode: '',
      siteIds: ''
    }
  },

  created() {
    const { id, industryCode, siteIds } = this.$route.query
    this.id = id
    this.industryCode = industryCode
    this.siteIds = siteIds
  },

  methods: {

    // 跳转下一步
    nextHandle(step) {
      // 保证金功能未准备好，直接跳转结束
      this.step = step
    }

  }
}
</script>

<style lang="scss" scoped>
.enter-box{
  position: relative;
  display: flex;
  flex-direction: column;
  height: 100%;
}
</style>
